import React, { useState } from 'react'
import { useSelector, useDispatch } from 'react-redux';
import Button from '@mui/material/Button';
import ButtonGroup from '@mui/material/ButtonGroup';
import Box from '@mui/material/Box';
import { updateSubmitStatus } from '../redux/actions'
import { SUBMIT_STATUS_SUBMIT, SUBMIT_STATUS_VIDEO,SUBMIT_STATUS_INVITATION } from '../contants.js'
import '../index.css'

function SubmitTools(props) {
  const selectedRowKeys = useSelector(state => state.job.selectedRowKeys)
  const dispatch = useDispatch()

  const onSubmit = ()=>{
    dispatch(updateSubmitStatus({ids:selectedRowKeys, status: SUBMIT_STATUS_SUBMIT}))
  }

  const onInvitation = ()=>{
    dispatch(updateSubmitStatus({ids:selectedRowKeys, status: SUBMIT_STATUS_INVITATION}))
  }

  const onSendVideo = ()=>{
    dispatch(updateSubmitStatus({ids:selectedRowKeys, status: SUBMIT_STATUS_VIDEO}))
  }

  return (
    <div>
      <Box sx={{
        textAlign: 'right',
        marginTop: '5px',
        marginBottom: '5px',
      }}>
        {!!selectedRowKeys.length && <span style={{paddingRight: 10}}>已选中{selectedRowKeys.length}条</span>}
        <ButtonGroup variant="outlined" aria-label="Basic button group">
          <Button onClick={onSubmit}>投递</Button>
          <Button onClick={onSendVideo}>发录屏</Button>
          <Button onClick={onInvitation}>面邀</Button>
        </ButtonGroup>
      </Box>
    </div>)
  
}


export default SubmitTools